﻿<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>操作系统</title>
    <link rel="stylesheet" type="text/css" th:href="@{/bootstrap/css/bootstrap.min.css}"/>
    <script type="text/javascript" th:src="@{/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
</head>
<body>
<div class="container-fluid" style="margin-top: 30px;">
    <div class="row">
        <div class="col-md-11">
        </div>
        <div class="col-md-1">
            <button type="button" onclick="window.location=ctx" class="btn btn-success btn-sm">首页</button>
        </div>
    </div>
    <br/>
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-success">
                <div class="panel-heading" role="tab" href="#collapse_3" id="heading_3" data-toggle="collapse">
                    <h4 class="panel-title">
                        <div class="row">
                            <div class="col-md-10">
                                执行结果
                            </div>
                            <div class="col-md-2">
                            </div>
                        </div>
                    </h4>
                </div>
                <div id="collapse_3" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="heading_3">
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-md-12" id="result">

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-success">
                <div class="panel-heading" role="tab">
                    <div class="row">
                        <h4 class="panel-title">
                            <div class="col-md-10" href="#collapse_4" id="heading_4" data-toggle="collapse">
                                <a role="button">
                                    Shell 脚本
                                </a>
                            </div>
                            <div class="col-md-2">
                                <button type="button" onclick="getResult();" class="btn btn-success" style="width: 180px;">&nbsp;&nbsp;E x e c u t e !&nbsp;&nbsp;</button>
                            </div>
                        </h4>
                    </div>
                </div>
                <div id="collapse_4" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="heading_4">
                    <div class="panel-body">
                        <textarea class="form-control" rows="10" id="command"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" th:inline="javascript">
    var ctx = [[@{/}]];ctx = ctx.substr(0, ctx.length - 1);<!--获取项目根路径-->

    function getResult(){
        var command = $.trim($("#command").val());
        $.ajax({
            type: "post",
            url: ctx + "/system/results",
            data: {
                command: command
            },
            dataType: "text",
            async: false,
            success: function (data) {
                $("#result").html(data);
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                alert(XMLHttpRequest.responseText);
            }
        });
    }

</script>
</body>
</html>